<template>
    <view class="news-detail bg-white">
       

        <!-- 咨询内容 -->
        <view class="news-detail-section bg-white p-[24rpx]">
            <!-- 摘要 -->
            <view class="summary p-[20rpx] text-base" style="line-height: 1.5;" >
              <view class="flex text-1xl jcsb">
              	<view class="flex items-center">
              		<view class="cor_999 ">报价：</view>
              		<view v-if="newsData.price_type == 1"  class="ml-[10rpx] cor_FF7 text-1xl">按量面议</view>
              		<view v-if="newsData.price_type == 2" class="ml-[10rpx] cor_FF7 text-1xl">￥{{newsData.price}}</view>
              	</view>
              	<view class="flex items-center ">
              		<view class="cor_999 ">质检费：</view>
              		<view class="ml-[10rpx] cor_FF7 text-1xl">{{newsData.qc_price}}%</view>
              	</view>
              </view>
              
              <view class="flex mt-[10rpx] text-1xl ">
              	<view class="text-muted  w-full flex  mt-[12rpx] jcsb">
              		<view class="flex items-center rft-xian">
              			<view >已联系：{{ newsData.click }} 人</view>
              		</view>
              		<view class="ml-[20rpx]">
              			<text v-if="newsData.is_baoyou == 2">不出邮费</text>
              			<text v-if="newsData.is_baoyou == 1" >包邮</text>
              			<text v-if="newsData.is_baoyou == 3">按量洽谈</text>
              		</view>
              	</view>
                <!--  <view class="mr-[40rpx]" >作者: 121212</view>
                  <view class="text-muted mr-[40rpx] flex-1">{{ newsData.create_time }}</view>
                  <view class="flex items-center text-muted flex-none">
                      <view class="ml-[10rpx]">{{ newsData.click }}</view>
                  </view> -->
              </view>
                   
            </view>
			<!-- 标题信心 -->
			<view class="news-detail-header py-[20rpx] px-[30rpx]">
			    <view class="text-2xl font-medium" style="line-height: 1.5;"> 
				<text>{{newsData.desc}}</text>
				</view>
			</view>
			
            <!-- 内容 -->
            <view class="mt-[20rpx]" >
				<view>
					
				</view>
				<image mode="widthFix" width="100%" v-for="i in newsData.photos" :src="i"></image>
                <!-- <u-parse :html="newsData.content"></u-parse> -->
            </view>
        </view>

        <!-- <view class="panel-btn flex items-center px-[34rpx]" @click="handleAddCollect(newsData.id)">
            <text >发布求购</text>
        </view>
		 -->
		<view style="height: 200rpx;"></view>
		<view class="fabu-btn">
			<view class="fabu-b" @click="toPath('/pages/qiugou/fabu')" >
				发布求购
			</view>
			<view class="woyouhuo" @click="showImage(newsData.kf)">
				我有货
			</view>
		</view>
		
		
    </view>
</template>

<script lang="ts" setup>
import { ref } from 'vue'
import { onLoad,onShareAppMessage} from '@dcloudio/uni-app'
import { getArticleDetail, addCollect, cancelCollect,getQgDetail} from '@/api/news'
import { showImage, call, copy, lookMap } from "@/utils/tools.ts"
import { storeToRefs } from 'pinia'
	import { useUserStore } from '@/stores/user'

const newsData = ref<any>({})
let newsId = ''


	
	const userStore = useUserStore()
	const { userInfo, isLogin } = storeToRefs(userStore)

const getData = async (id) => {
    newsData.value = await getQgDetail({ id })
}

const handleAddCollect = async (id: number) => {
   
}

const toPath = (link : any, login = true) => {
		// console.log(login,isLogin.value == false)
		if (isLogin.value == false && login) {
			uni.navigateTo({
				url: '/pages/login/login'
			})
			return false;
		}
		uni.navigateTo({
			url: link
		})
	}

onLoad((options: any) => {
    newsId = options.id
    getData(newsId)
})
onShareAppMessage(() => {
	
	// 使用正则表达式匹配汉字，并限制匹配数量为10个  
	  // const regex = /^([\u4e00-\u9fa5]{0,10})/;  
	  // const match = newsData.value.desc.match(regex);  
	  // let title =  match ? match[0] : ''; 
	// str.substring(0, 5)
		return {
			title: newsData.value.desc.substring(0,10),
			path: '/pages/index/index?agentId=' + userInfo?._object?.userInfo?.id || 0,
		}
	})
</script>

<style lang="scss">
	.fabu-btn{
		padding: 45rpx 30rpx;
		display: flex;
		position: fixed;
		width: 100vw;
		bottom: 0;
		// background-color: #FFFFFF;
		.fabu-b{
			height: 90rpx;
			line-height: 90rpx;
			border-radius: 45rpx;
			border: 2px solid #4DF280;
			padding: 0 60rpx;
			font-weight: 600;
			font-size: 30rpx;
			color: #16E86E;
			background-color: #fff;
		}
		.woyouhuo{
			height: 90rpx;
			background: linear-gradient( 90deg, #31F5A7 0%, #9AE910 100%);
			border-radius: 45rpx;
			line-height: 90rpx;
			text-align: center;
			flex: 1;
			margin-left: 30rpx;
			font-weight: 600;
			font-size: 30rpx;
			color: #FFFFFF;
			
		}
	}
	
.news-detail {
    height: 100%;

    &-header {
        border-bottom: 2rpx solid #f8f8f8;
    }

    &-section {
        .summary {
            border-radius: 12rpx;
            background-color: #f7f7f7;
        }
    }

    .panel-btn {
        position: fixed;
        right: 30rpx;
        height: 80rpx;
        bottom: 200rpx;
        border-radius: 40rpx;
        background: rgba(255, 255, 255, 0.95);
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.16);
    }
}
</style>
